<template>
	<view class="orderTabs">
		<view class="good-top" v-for="item in list">
			<view class="front-good">商品名称：</view> </text><text class="good">{{item.name}}</text> 
			<view class="front-good">商品数量：</view><text class="good">{{item.number}}</text>
			<view class="front-good">商品价格：</view><text class="good">{{item.price}}</text>
			<view class="good">创建时间：</view><text >{{ timeStamp(item.time) }}</text>
		</view>
		
		
		<view class="all-order" v-for="(item,index) in time">
			<view class="" @click="getTime(item.time)">
				<view class="text-order">第{{index+1}}单：</view>
				<view class="text-time">下单时间：{{ timeStamp(item.time) }}</view>
			</view>
			
		</view>
	</view>
</template>
 
<script>
	export default {
		data() {
			return {
				time: [],
				list: []
			}
		},
		
		methods: {
			async getData () {
				this.time = []
				const res = await this.$myRuquest({
					url: '/order/findTime'
				})
				console.log(res.data)
				res.data.forEach(item => {
					var obj = {};
					obj = {time : item}
					this.time.push(obj)
				})
				
				},	
			async getTime(option) {
				option = this.timeStamp(option)
				console.log(option)
				const res = await this.$myRuquest({
					url: '/order/byTimeFind/'+option
				})
				console.log(res)
				this.list = res.data
				
			},
			timeStamp(value) {
				var date = new Date(value); //时间戳为10位需*1000，时间戳为13位的话不需乘1000
				var year = date.getFullYear();
				var month = ("0" + (date.getMonth() + 1)).slice(-2);
				var sdate = ("0" + date.getDate()).slice(-2);
				var hour = ("0" + date.getHours()).slice(-2);
				var minute = ("0" + date.getMinutes()).slice(-2);
				var second = ("0" + date.getSeconds()).slice(-2);
				// 拼接
				var result = year + "-" + month + "-" + sdate + " " + hour + ":" + minute + ":" + second;
				// 返回
				return result;
			}
		},
		onShow: function(option) {
			this.getData();
		},
		
	}
</script>
 
<style>
.all-order{
	background-color: #F8F8F8;
	text-align: center;
	margin-top: 20px;
	;line-height:50px;
}
	
.text-order{
	font-size: x-large;
	font-weight: 600;
	color: #FF3366;
}
.text-time{
	height: 50px;
	color: #007AFF;
	font-weight: 500;
	margin: auto auto;
}

.good {
	color: #FFCC33;
}
.front-good{
	display: inline;
	font-size:larger;
	color: #4CD964;
	margin-top: 20px;
}
</style>